<template>
  <div class="tour">
    <UniHeader />
    <WaterFall :itemList="tourList"></WaterFall>
    <NavTab></NavTab>
  </div>
</template>

<script>
// @ is an alias to /src
import UniHeader from '@/components/UniHeader.vue'
import WaterFall from '@/components/WaterFall.vue'
import NavTab from '@/components/NavTab.vue'
import { useStore } from "vuex"
import { computed } from 'vue'
export default {
  name: 'TourView',
  components: {
    UniHeader,
    WaterFall,
    NavTab
  },
  setup() {
    let list = []
    for (let i = 1; i <= 30; i++) {
      list.push({
        url: `https://img.xjh.me/random_img.php?type=bg&ctype=nature&return=302&random=${Math.random()}`,
        title: '中华郡国际旅游度假区',
        sub: '亲子游乐天堂',
        price: '¥40'
      })
    }
    const store = useStore()
    store.commit('setTourList', list)
    return {
      tourList: computed(() => store.state.tourList)
    }
  }
}
</script>
<style scoped>
.tour {
  height: 100vh;
  overflow-y: scroll;
  background: white;
}
</style>
